<template>
    <div>
        <h1>员工修改</h1>
        <table class="table table-bordered">
            <tr>
                <td><span>*</span>姓名</td>
                <td>
                    <input type="text" v-model="w.name">
                </td>
            </tr>
            <tr>
                <td>员工编号</td>
                <td>
                    <input type="text" disabled v-model="w.code">
                </td>
            </tr>
            <tr>
                <td>头像</td>
                <td>
                    <input type="file" @change="Wimage">
                    <img :src="w.wPhoto" alt="" width="100px" height="100px">
                </td>
            </tr>
            <tr>
                <td><span>*</span>手机号码</td>
                <td>
                    <input type="text" v-model="w.phone">
                </td>
            </tr>
            <tr>
                <td>角色</td>
                <td>
                    <select v-model="w.role">
                        <option value="">请选择</option>
                        <option value="超级管理员">超级管理员</option>
                        <option value="管理员">管理员</option>
                        <option value="员工">员工</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td><span>*</span>登录密码</td>
                <td>
                    <input type="password" v-model="w.pWd">
                </td>
            </tr>
            <tr>
                <td>状态</td>
                <td>
                    <input type="radio" name="status" v-model="w.state" :value="0"> 禁用
                    <input type="radio" name="status" v-model="w.state" :value="1"> 启用
                </td>
            </tr>
            <tr>
                <td>备注</td>
                <td>
                    <textarea v-model="w.tell" rows="3" cols="20">


                    </textarea>
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <input type="button" value="修改" class="btn btn-primary" @click="wadd">
                </td>
            </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import { reactive, toRefs, onMounted } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import axios from 'axios';
import moment from 'moment';

let route = useRoute();
let router = useRouter();
let data: ant = reactive({
    w: {
        "name": "",
        "code": moment(new Date()).format('YYYYMMDD') + ((Math.random() * 900) + 100).toFixed(0),
        "wPhoto": "",
        "phone": "",
        "role": "",
        "pWd": "",
        "state": 0,
        "tell": "",
        "gpeople": "李明明",
    },
});
let { w } = toRefs(data);
const wadd = () => {
    if (w.value.name == "") {
        alert("姓名不能为空");
        return;
    }
    if (w.value.phone == "") {
        alert("电话不能为空");
        return;
    }
    if (w.value.role == "") {
        alert("角色不能为空");
        return;
    }
    if (w.value.pWd == "") {
        alert("密码不能为空");
        return;
    }
    if (w.value.tell == "") {
        alert("备注不能为空");
        return;
    }
    let obj = {
        id:route.query.id,
        name: w.value.name,
        code: w.value.code,
        wPhoto: w.value.wPhoto,
        phone: w.value.phone,
        role: w.value.role,
        pWd: w.value.pWd,
        state: w.value.state,
        tell: w.value.tell,
        gpeople:"李明明",

    }
    axios({
        url: '/api/WorkeClass/WUpd',
        method: 'put',
        data: obj
    }).then((res) => {
        if (res.data.data > 0) {
            alert('修改成功');
            router.push('/list')
        }
        else {
            alert('修改失败');
            return;
        }
    })
}

const Wimage = (e: any) => {
    let file = e.target.files[0];
    let formdata= new FormData();
    formdata.append('file',file);
    axios({
        url: '/api/WorkeClass/WImage',
        method: 'post',
        data: formdata
    }).then((res) => {
       
            w.value.wPhoto = res.data.data;
        
    })
}

onMounted(() => {
    Fan();
})
const Fan = () => {
    let obj={
        id:route.query.id
    }
    axios({
        url: '/api/WorkeClass/FanTain',
        method: 'get',
        params: obj
    }).then((res) => {
        w.value = res.data.data;
    })
}
</script>

<style scoped>
span {
    color: red;
}
</style>